@extends('admin.layouts')
@section('css')
    <link href="{{asset('assets/css/bootstrap.min.css')}}" rel="stylesheet" />
    <link rel="stylesheet" href="{{asset('assets/css/font-awesome.min.css')}}" />
    <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:400,300" />

    <link rel="stylesheet" href="{{asset('assets/css/ace.min.css')}}" />
    <link rel="stylesheet" href="{{asset('assets/css/ace-rtl.min.css')}}" />
    <link rel="stylesheet" href="{{asset('assets/css/ace-skins.min.css')}}" />
    <script src="{{asset('assets/js/ace-extra.min.js')}}"></script>

    <link rel="stylesheet" type="text/css" href="{{asset('assets/uploadifive/uploadifive.css')}}">

    <link rel="stylesheet" href="{{asset('assets/wangEditor/css/wangEditor.min.css')}}">
    <style>
        #tip-queue {
            border: 1px solid #E5E5E5;
            height: 177px;
            overflow: auto;
            margin-bottom: 10px;
            padding: 0 3px 3px;
            width: 300px;
        }
        .uploadifive-button{border:none; border-radius:1px; height: 28px;background:#3bb4f2;color:#fff;}
        #editor-trigger {
            height: 400px;
            /*max-height: 500px;*/
        }
    </style>
@endsection
@section('content')

    <div class="main-content">
        <div class="breadcrumbs" id="breadcrumbs">
            <script type="text/javascript">
                try{ace.settings.check('breadcrumbs' , 'fixed')}catch(e){}
            </script>

            <ul class="breadcrumb">
                <li>
                    <i class="icon-home home-icon"></i>
                    <a href="{{url('admin/index')}}">主页</a>
                </li>

                <li>
                    <a>文章</a>
                </li>
                <li class="active">修改文章</li>
            </ul><!-- .breadcrumb -->

            <div class="nav-search" id="nav-search">
                <form class="form-search">
                    <span class="input-icon">
                        <input type="text" placeholder="Search ..." class="nav-search-input" id="nav-search-input" autocomplete="off" />
                        <i class="icon-search nav-search-icon"></i>
                    </span>
                </form>
            </div><!-- #nav-search -->
        </div>

        <div class="page-content">
            <div class="page-header">
                <h1>
                    文章
                    <small>
                        <i class="icon-double-angle-right"></i>
                        修改文章
                    </small>
                </h1>
            </div><!-- /.page-header -->

            <div class="row">
                <div class="col-xs-12">
                    <!-- PAGE CONTENT BEGINS -->

                    <form class="form-horizontal" id="articleForm" role="form" method="post" action="">
                        <div class="form-group">
                            <label class="col-sm-2 control-label no-padding-right" for="category_id"> 文章分类 </label>

                            <div class="col-sm-10">
                                <select name="category_id" id="category_id" class="col-xs-10 col-sm-5">
                                    <option value="">==选择文章分类==</option>
                                    @foreach($category as $v)
                                    <option value="{{$v['id']}}"
                                    @if($articleInfo['category_id']==$v['id'])
                                        selected=""
                                    @else
                                    @endif
                                    >{{$v['category']}}</option>
                                        @endforeach
                                </select>
                                <span class="help-inline col-xs-12 col-sm-7">
                                    <span class="middle">必填</span>
                                </span>
                            </div>
                        </div>
                        <input type="hidden" id="articleId" name="id" value="{{$articleInfo['id']}}">
                        <div class="form-group">
                            <label class="col-sm-2 control-label no-padding-right" for="form-field-1title"> 文章标题 </label>

                            <div class="col-sm-10">
                                <input type="text" id="form-field-1title" value="{{$articleInfo['title']}}" name="title" placeholder="文章标题" class="col-xs-10 col-sm-5" />
                                <span class="help-inline col-xs-12 col-sm-7">
                                    <span class="middle">必填</span>
                                </span>
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-2 control-label no-padding-right" for="coverpath"> 封面图 </label>
                            <div class="col-sm-10">
                                <input type="text" class="col-xs-4" id="coverpath" readonly value="{{$articleInfo['cover']}}" name="cover">
                                <input id="file_upload" type="file" name="cover" />
                                <div id="tip-queue" class="col-xs-4" style="display: none"></div>
                                @if(empty($articleInfo['cover']))
                                <img src="{{asset('assets/images/uploadbg.jpg')}}" alt="cover" id="shoCover" style="width: 200px;height: 150px;border: 1px solid lightblue">
                                    @else
                                    <img src="{{$articleInfo['cover']}}" alt="cover" id="shoCover" style="width: 200px;height: 150px;border: 1px solid lightblue">
                                    @endif
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-2 control-label no-padding-right" for="bannerpath"> Banner图(可选) </label>
                            <div class="col-sm-10">
                                <input type="text" class="col-xs-4" id="bannerpath" readonly value="{{$articleInfo['banner']}}" name="banner">
                                <input id="banner_upload" type="file" name="banner" />
                                <div id="tip-queue1" class="col-xs-4" style="display: none"></div>
                                @if(empty($articleInfo['banner']))
                                <img src="{{asset('assets/images/uploadbannerbg.jpg')}}" alt="banner" id="shoBanner" style="width: 200px;height: 92px;border: 1px solid lightblue">
                                    @else
                                    <img src="{{$articleInfo['banner']}}" alt="banner" id="shoBanner" style="width: 200px;height: 92px;border: 1px solid lightblue">
                                @endif
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-2 control-label no-padding-right" for="form-field-1"> 文章内容 </label>

                            <div class="col-sm-10">
                                {{--<script id="editor" name="art_content" type="text/plain" style="width:95%;height:400px;"></script>--}}
                                <textarea id="editor-trigger" name="content" style="display:none;">
                                    {{$articleContent['content']}}
                                </textarea>
                                <span class="help-inline col-xs-12 col-sm-7">
                                    <span class="middle">必填</span>
                                </span>
                            </div>
                        </div>

                        <div class="space-4"></div>

                        <div class="clearfix form-actions">
                            <div class="col-md-offset-3 col-md-9">
                                <button class="btn btn-info" type="submit">
                                    <i class="icon-ok bigger-110"></i>
                                    提交
                                </button>

                                &nbsp; &nbsp; &nbsp;
                                <button class="btn" type="reset">
                                    <i class="icon-undo bigger-110"></i>
                                    取消
                                </button>
                            </div>
                        </div>
                    </form>
                </div><!-- PAGE CONTENT ENDS -->
            </div><!-- /.col -->
        </div><!-- /.row -->
    </div>

    @endsection
@section('javascript')
    <script src='{{asset('assets/js/jquery-2.0.3.min.js')}}'></script>
    <script src="{{asset('assets/js/bootstrap.min.js')}}"></script>
    <script src="{{asset('assets/js/typeahead-bs2.min.js')}}"></script>
    <script type="text/javascript" src="{{asset('assets/layer/layer.js')}}"></script>
    <!-- ace scripts -->
    <script type="text/javascript" src="{{asset('assets/layer/layer.js')}}"></script>
    <script src="{{asset('assets/js/ace-elements.min.js')}}"></script>
    <script src="{{asset('assets/js/ace.min.js')}}"></script>

    <script type="text/javascript" src="{{asset('assets/uploadifive/jquery.uploadifive.js')}}"></script>


    <script src="{{asset('assets/wangEditor/wangEditor.min.js')}}"></script>

    {{--<script type="text/javascript" charset="utf-8" src="{{asset('assets/ueditor/ueditor.config.js')}}"></script>
    <script type="text/javascript" charset="utf-8" src="{{asset('assets/ueditor/ueditor.all.min.js')}}"> </script>
    <script type="text/javascript" charset="utf-8" src="{{asset('assets/ueditor/lang/zh-cn/zh-cn.js')}}"></script>
    <script>
        var ue = UE.getEditor('editor');
    </script>--}}
    <script>
        $(function(){
            $('#file_upload').uploadifive({
                'formData'     : {
                    '_token'     : "{{csrf_token()}}"
                },
                'uploadScript' : "{{asset('admin/uploadimg')}}",
                'multi':false,
                'buttonText'   : '选择图片',   //按钮显示文字
                'queueID'      : 'tip-queue', //提示信息放置目标
                'fileType'     : 'image/*',   //允许上传文件类型
                'onSelect': function (file) {
                    layer.load(1);
                },
                'onUploadComplete': function(file,data,response){
                    layer.closeAll('loading');
                    data= $.parseJSON(data);
                    if(!data.status){
                        alert(data.msg);
                    }else{
                        layer.msg('图片上传完毕');
                        $("#coverpath").val(data.msg);
                        $("#shoCover").attr('src',data.msg+'-185X141');
                    }

                }
            });

            $('#banner_upload').uploadifive({
                'formData'     : {
                    '_token'     : "{{csrf_token()}}"
                },
                'uploadScript' : "{{asset('admin/uploadimg')}}",
                'multi':false,
                'buttonText'   : '选择图片',   //按钮显示文字
                'queueID'      : 'tip-queue1', //提示信息放置目标
                'fileType'     : 'image/*',   //允许上传文件类型
                'onSelect': function (file) {
                    layer.load(1);
                },
                'onUploadComplete': function(file,data,response){
                    layer.closeAll('loading');
                    data= $.parseJSON(data);
                    if(!data.status){
                        alert(data.msg);
                    }else{
                        layer.msg('图片上传完毕');
                        $("#bannerpath").val(data.msg);
                        $("#shoBanner").attr('src',data.msg+'-200X92');
                    }

                }
            });
        })
    </script>

    <script type="text/javascript">
        // 阻止输出log
        wangEditor.config.printLog = false;

        var editor = new wangEditor('editor-trigger');

        // 上传图片
        editor.config.uploadImgUrl = "{{url('admin/uploadimg')}}";
        editor.config.uploadParams = {
             _token: "{{csrf_token()}}",
            // token2: '12345'
        };
        editor.config.uploadHeaders = {
             'Accept' : 'image/*'
        };
         editor.config.uploadImgFileName = 'Filedata';

        // 隐藏网络图片
        // editor.config.hideLinkImg = true;

        // 表情显示项
        editor.config.emotionsShow = 'value';
        editor.config.emotions = {
            'default': {
                title: '默认',
                data: "{{asset('assets/wangEditor/emotions.data')}}"
            },
            'weibo': {
                title: '微博表情',
                data: [
                    {
                        icon: 'http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/7a/shenshou_thumb.gif',
                        value: '[草泥马]'
                    },
                    {
                        icon: 'http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/60/horse2_thumb.gif',
                        value: '[神马]'
                    },
                    {
                        icon: 'http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/bc/fuyun_thumb.gif',
                        value: '[浮云]'
                    },
                    {
                        icon: 'http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/c9/geili_thumb.gif',
                        value: '[给力]'
                    },
                    {
                        icon: 'http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/f2/wg_thumb.gif',
                        value: '[围观]'
                    },
                    {
                        icon: 'http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/70/vw_thumb.gif',
                        value: '[威武]'
                    }
                ]
            }
        };

        // 只粘贴纯文本
        // editor.config.pasteText = true;

        // 普通菜单配置
         editor.config.menus = [
             'source',
             '|',
             'bold',
             'underline',
             'italic',
             'strikethrough',
             'eraser',
             'forecolor',
             'bgcolor',
             '|',
             'quote',
             'fontfamily',
             'fontsize',
             'head',
             'unorderlist',
             'orderlist',
             'alignleft',
             'aligncenter',
             'alignright',
             '|',
             'link',
             'unlink',
             'table',
             'emotion',
             '|',
             'img',
//             'video',
             'location',
             'insertcode',
             '|',
             'undo',
//             'redo',
             'fullscreen'
         ];

        // 取消过滤js
        // editor.config.jsFilter = false;

        // 取消粘贴过来
        // editor.config.pasteFilter = false;

        // 设置 z-index
        // editor.config.zindex = 20000;

        // 自定义load事件
        editor.config.uploadImgFns.onload = function (resultText, xhr) {
            // resultText 服务器端返回的text
            // xhr 是 xmlHttpRequest 对象，IE8、9中不支持
            resultText= $.parseJSON(resultText);
            // 如果 resultText 是图片的url地址，可以这样插入图片：
            editor.command(null, 'insertHtml', '<img src="' + resultText.msg + '" style="max-width:100%;"/>');
            // 如果不想要 img 的 max-width 样式，也可以这样插入：
            // editor.command(null, 'InsertImage', resultText);
        };
        // 自定义timeout事件
        editor.config.uploadImgFns.ontimeout = function (xhr) {
            // xhr 是 xmlHttpRequest 对象，IE8、9中不支持
            alert('上传超时');
        };

        // 自定义error事件
        editor.config.uploadImgFns.onerror = function (xhr) {
            // xhr 是 xmlHttpRequest 对象，IE8、9中不支持
            alert('上传错误');
        };
        editor.create();

        $("#articleForm").submit(function () {
            layer.msg('提交中', {
                icon: 16
                ,shade: 0.01
            });
            var content=editor.$txt.html();
            var category_id=$("#category_id").val();
            var titler=$('#form-field-1title').val();
            var cover=$('#coverpath').val();
            var banner=$('#bannerpath').val();
            var id=$('#articleId').val();
            if(content=='' || titler=='' || category_id==''){
                layer.msg('有未填写项');
            }else{
                $.post('{{url('admin/updatearticle')}}',{'id':id,'_token':"{{csrf_token()}}",'banner':banner,'title':titler,'content':content,'cover':cover,'category_id':category_id}, function (res) {
                    if(res.status){
                        layer.msg(res.msg);
                    }else{
                        layer.msg(res.msg);
                    }
                })
            }
            return false;
        });

    </script>
    @endsection